<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script src="../lib/jquery-3.4.1.js"></script>
    <script src="html.js"></script>
    <style>
        img {
            width: 250px;
            height: 250px;
        }
    </style>
</head>
<input type="text" id="input">
<p></p>
<img src="" alt="">
<audio src="" controls="controls" autoplay></audio>

<body>
    <script>
        //获取歌曲ID
        /* http({
            url: "search?keywords=童话",
            callback: getId
        })

        function getId(res) {
            var id = res.result.songs[0],
                id;
            console.log(id)
            //获取图片
            http({
                url: `song/detail?ids=${id}`,
                callback: getImgUrl
            })
            //获取音乐
            http({
                url: `${url}song/url?id=${id}`,
                callback: getMusicUrl
            })
        }

        function getImgUrl(res) {
            var imgUrl = res.songs[0].al.picUrl;
         
        }

        function getMusicUrl(res) {
            var musicUrl = res.data[0].url;
            console.log(musicUrl);
        } */
        // var input=document.getElementById("input");
        $("input").keyup(function (event) {
            if (event.keyCode == 13) {
                var value = $(this).val()
                http({
                    url: `search?keywords=${value}`,
                    callback: getId
                })

                function getId(res) {
                    var id = res.result.songs[0].id;

                    console.log(id)
                    //获取图片ID
                    http({
                        url: `song/detail?ids=${id}`,
                        callback: getImgUrl
                    })
                    //获取音乐
                    http({
                        url: `song/url?id=${id}`,
                        callback: getMusicUrl
                    })
                }

                function getImgUrl(res) {
                    var imgUrl = res.songs[0].al.picUrl;
                    $("img").attr("src", imgUrl)
                }

                function getMusicUrl(res) {
                    var musicUrl = res.data[0].url;
                    console.log(musicUrl);
                    $("audio").attr("src", musicUrl)
                }
            }
        })
    </script>
</body>

</html>